import { ref } from 'vue'
import { defineStore } from 'pinia'
import { COLORLIST, type ColorItem } from '@/shared/colorList'

export const useColorStore = defineStore('color', () => {
  // state
  const text = ref('Sample Text')
  const angle = ref(100)
  const colorList = ref<ColorItem[]>(COLORLIST.slice(0, 2))

  // action

  // 设置文案
  const setText = (newText: string) => {
    text.value = newText
  }

  // 设置角度
  const setAngle = (newAngle: number) => {
    angle.value = newAngle
  }

  // 设置颜色列表
  const setColorList = (newList: ColorItem[]) => {
    colorList.value = newList
  }

  return {
    text,
    angle,
    colorList,
    setText,
    setAngle,
    setColorList,
  }
})
